/*主页面，路由组件*/
import React, { PureComponent, Fragment } from 'react';
import { BrowserRouter as Router, Route, Switch, Redirect } from 'react-router-dom';

import Auth from './components/auth';   // 验证用户是否登录
import MainLayout from './main_layout';   // 布局模板
import NoMatch from './pages/no_match';   // 没有匹配到任何路由的错误页面
import Home from './pages/home';    // 首页
import ButtonPage from './pages/buttons';   // 按钮页
import ModalPage from './pages/modals';   // 模态框页面
import LoadingPage from './pages/loading';  // loading页面
import NoticePage from './pages/notice';  // 通知提醒框页面
import MessagePage from './pages/messages';   // 全局提示框页面
import TabPage from './pages/tabs';   // tab页面
import Gallery from './pages/gallery';  // 画廊页面
import CarouselsPage from './pages/carousel';  // 画廊页面
import LoginPage from './pages/login';    // 登录页面
import Register from './pages/register';  // 注册页面
import BasicTable from './pages/table_basic';  // 基础表格页面
import HighTable from './pages/table_high';  // 高级表格页面
import Order from './pages/order';  // 订单管理
import OrderDtail from './pages/order_detail';    // 订单详情
import Bar from './pages/charts_bar';    // 柱形图
import Pie from './pages/charts_pie';    // 饼图
import Line from './pages/charts_line';    //  折线图
import Rich from './pages/rich';    //  富文本
import Permission from './pages/permission';  // 用户授权


import './app.less'

class App extends PureComponent {
  render() {
    return (
        <Router>
          <Fragment>
            <Auth/>
            <Switch>
              <Route exact path="/login" component={LoginPage} />
              <Route exact path="/reg" component={Register} />
              <Route path="/" render={() =>
                <MainLayout>
                  <Switch>
                    <Route path="/" exact component={Home} />
                    <Route path="/home" component={Home} />
                    <Route path="/ui/buttons" component={ButtonPage} />
                    <Route path="/ui/modals" component={ModalPage} />
                    <Route path="/ui/loadings" component={LoadingPage} />
                    <Route path="/ui/notification" component={NoticePage} />
                    <Route path="/ui/messages" component={MessagePage} />
                    <Route path="/ui/tabs" component={TabPage} />
                    <Route path="/ui/gallery" component={Gallery} />
                    <Route path="/ui/carousel" component={CarouselsPage} />
                    <Route path="/table/basic" component={BasicTable} />
                    <Route path="/table/high" component={HighTable} />
                    <Route path="/order" component={Order} />
                    <Route path="/orderdetail/:id" component={OrderDtail} />
                    <Route path="/charts/bar" component={Bar} />
                    <Route path="/charts/pie" component={Pie} />
                    <Route path="/charts/line" component={Line} />
                    <Route path="/rich" component={Rich} />
                    <Route path="/permission" component={Permission} />
                  </Switch>
                </MainLayout>
              } />
              <Route component={NoMatch} />
            </Switch>
          </Fragment>
        </Router>
    );
  }
}

export default App;
